opacity
|
|
|
|
|
|
|||||||||
|
6.0 |
7.0 |
8.0 |
8.0 |
9.0 |
8.0 |
9.2 |
9.5 |
1.3 |
2.0 |
3.1 |
1.5 |
2.0 |
3.0 |
|
Ні |
Ні |
Ні |
Так |
Так |
Так |
Так |
Так |
Так |
Так |
Так |
Ні |
Так |
Так |
Коротка
інформація
|
CSS |
CSS3 |
|
Значення за умовчанням |
1 |
|
Наслідує |
Ні |
|
Застосовується |
До
усіх елементів |
|
Аналог HTML |
Ні |
|
Посилання на специфікацію |
http://www.w
3.org/TR/css3 - color/#transparency |
Опис
Визначає
рівень прозорості елементу веб-сторінки. При частковій або повній прозорості
через елемент проступає фоновий малюнок або інші елементи, розташовані нижче за
напівпрозорий об'єкт.
Синтаксис
opacity:
значення
Значення
Значенням
виступає число з діапазону [0.0; 1.0]. Значення 0 відповідає повній прозорості
елементу, а 1, навпаки - його непрозорості. Дробові числа виду 0.6 встановлюють
напівпрозору. Допускається писати числа без нуля попереду, виду opacity : .6.
Приклад
HTML 4.0
CSS 2.1 IE 6 IE 7 IE 8
Op 9.5 Sa 3.1 Ff 2.0 Ff 3.0
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http ://www.w 3.org/TR/html4/strict.dtd"><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows - 1251"> <title>opacity</title> <style type="text/css"> IMG.semi { opacity: 0.5; /* Напівпрозора елементу */ } </style> </head> <body> <p> <img src="igels.gif" alt="Звичайний малюнок"> <img src="igels.gif" alt="Напівпрозорий малюнок" class="semi"> </p> </body></html>
Результат
цього прикладу показаний на мал. 1.
Мал. 1. Результат використання opacity
Браузери
Internet
Explorer для зміни прозорості використовує фільтри, для цього браузеру слід
записати filter: alpha(opacity=50), де параметр opacity може набувати значення
від 0 до 100.
